<template>
	<view :class="['container', { 'dark-mode': isDarkMode }, currentTheme]" @tap="closeDropdown">
		<view class="theme-ripple" :style="rippleStyle"></view>
		<!-- 主题切换按钮 -->
		<view class="theme-switch" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd"
			:style="switchStyle">
			<text class="theme-icon">{{ isDarkMode ? '🌙' : '☀️' }}</text>
		</view>
		<!-- 头部 -->
		<view class="header">
			<view class="header-main">
				<view class="title-wrapper">
					<text class="title">礼记</text>
					<text class="subtitle">记录人情往来</text>
				</view>
			</view>
		</view>
		<!-- 统计卡片 -->
		<view class="stats-card">
			<view class="stats-row">
				<view class="stats-item">
					<text class="stats-label">收礼总额</text>
					<text class="stats-value">¥{{ dashboardData.totalAmount.toLocaleString('zh-CN', {
						minimumFractionDigits: 2, maximumFractionDigits: 2
					}) }}</text>
				</view>
				<view class="stats-item">
					<text class="stats-label">宾客总数</text>
					<text class="stats-value">{{ dashboardData.guestCount }}人</text>
				</view>
			</view>
		</view>

		<!-- 搜索框 -->
		<view class="search-wrapper">
			<view class="search-bar" :class="{ 'disabled': !isLoggedIn }">
				<text class="search-icon bigfont big-sousuo"></text>
				<input type="text" placeholder="搜索礼簿" :disabled="!isLoggedIn"
					:placeholder-style="'color:' + placeholderColor + ';transition: all 0.3s ease'" class="search-input"
					v-model="searchText" />
				<text v-if="searchText" class="clear-icon bigfont big-guanbi" @tap="clearSearch"></text>
				<text class="scan-icon bigfont big-iconfontscan" @tap="handleScan"></text>
			</view>
		</view>

		<!-- 礼簿列表 -->
		<scroll-view class="book-list" scroll-y @scrolltolower="loadMore" @refresherrefresh="onRefresh"
			:refresher-enabled="isLoggedIn" :refresher-triggered="isRefreshing" refresher-background="transparent"
			@scroll="handleScroll" @touchstart="closeDropdown">
			<view v-if="loading && !isRefreshing && bookList.length === 0" class="list-status">
				<text class="status-text">加载中...</text>
			</view>
			<view v-else-if="bookList.length === 0" class="list-status empty-status">
				<view class="empty-icon">📝</view>
				<text class="empty-text">暂无礼簿记录</text>
				<block v-if="isLoggedIn">
					<text class="empty-tips">点击右下角按钮新建礼簿</text>
				</block>
				<block v-else>
					<view class="login-btn" @tap="handleLogin">立即登录</view>
				</block>
			</view>
			<view v-else class="book-list-content">
				<view v-for="(book, index) in bookList" :key="book.id" class="book-item" @tap="navigateToDetail(book)">
					<view class="book-main">
						<view class="book-cover">
							<image :src="book.coverImageUrl" mode="aspectFill"></image>
						</view>
						<view class="book-info">
							<text class="book-title">{{ book.title }}</text>
							<text class="book-date">{{ formatDate(book.createTime) }}</text>
							<view class="book-stats">
								<view class="book-amount">
									<text class="amount-label">收礼金额</text>
									<text class="amount-value">¥{{ book.totalAmount || 0 }}</text>
								</view>
								<view class="guest-count">
									<text class="count">{{ book.guestCount || 0 }}</text>
									<text>位宾客</text>
								</view>
							</view>
						</view>
					</view>
					<view class="book-more big-gengduo bigfont" v-if="book.userId === userInfo.openId"
						@tap.stop="showDropdown($event, index)"></view>
				</view>
				<!-- 加载更多状态 -->
				<view v-if="loading && bookList.length > 0" class="load-more loading">
					<view class="loading-indicator"></view>
					<text class="load-more-text">加载中...</text>
				</view>
				<view v-else-if="!hasMore" class="load-more">
					<text class="load-more-text">没有更多了</text>
				</view>
			</view>
		</scroll-view>
		<!-- 悬浮添加按钮 -->
		<view v-if="isLoggedIn" class="float-btn" @click="createNewBook" @touchstart="closeDropdown">
			<text class="plus-icon bigfont big-jia"></text>
		</view>

		<!-- 添加遮罩层 -->
		<view class="dropdown-overlay" :class="{ visible: showMenu }" @tap="closeDropdown"></view>

		<!-- 添加下拉菜单 -->
		<view class="dropdown-menu" :class="{ visible: showMenu }" :style="menuPosition" @tap.stop>
			<view class="dropdown-item" @tap.stop="shareBook(currentBookIndex)">
				<text class="dropdown-icon bigfont big-fenxiang"></text>
				<text>分享</text>
			</view>
			<view class="dropdown-item" @tap.stop="editBook(currentBookIndex)">
				<text class="dropdown-icon bigfont big-tianxie"></text>
				<text>编辑</text>
			</view>
			<view class="dropdown-item delete" @tap.stop="deleteBook(currentBookIndex)">
				<text class="dropdown-icon bigfont big-shanchu"></text>
				<text>删除</text>
			</view>
		</view>

		<!-- 删除原有的弹框代码，保留组件引用 -->
		<book-modal v-if="showModal" v-model:visible="showModal" :is-edit="isEdit" :initial-data="formData"
			@saved="getList" />

		<!-- 分享模态框 -->
		<share-modal v-if="showShareModal" v-model:visible="showShareModal" :book-id="currentShareBookId"
			@qrcode="handleQrCode" @close="closeShareModal" />

		<!-- 二维码模态框 -->
		<qr-code-modal v-if="showQrCodeModal" v-model:visible="showQrCodeModal" :qr-code-url="qrCodeUrl"
			@close="closeQrCodeModal" />

		<!-- 遮罩层 -->
		<view class="modal-overlay" :class="{ visible: showModal || showShareModal || showQrCodeModal }"
			@tap="handleOverlayClick"></view>

		<!-- canvas用于生成二维码 -->
		<canvas canvas-id="qrcode" style="width: 400px; height: 400px; position: fixed; left: -1000px; top: -1000px;" />

		<!-- 用户信息弹窗 -->
		<user-info-modal v-if="showUserInfoModal" v-model:visible="showUserInfoModal" :is-dark-mode="isDarkMode"
			:login-data="loginData" @submit="handleUserInfoSubmit" />
	</view>
</template>



<script>
// 分享配置
export default {
	onShareAppMessage(res) {
		// 从缓存中获取分享配置
		const shareConfig = uni.getStorageSync('shareConfig') || {
			title: '礼簿分享',
			path: '/pages/index/index',
			imageUrl: ''
		};
		return shareConfig;
	},
	onShareTimeline() {
		// 从缓存中获取分享配置
		const shareConfig = uni.getStorageSync('shareConfig') || {
			title: '礼簿分享',
			query: '',
			imageUrl: ''
		};
		return {
			title: shareConfig.title,
			query: shareConfig.path.split('?')[1] || '',
			imageUrl: shareConfig.imageUrl
		};
	}
}
</script>

<script setup>
import { deleteGiftBook, getGiftBookDashboard, getGiftBookList } from '@/api/giftBook';
import { receiveShare } from '@/api/share-receive';
import { getOpenId } from '@/api/user';
import BookModal from '@/components/BookModal.vue';
import QrCodeModal from '@/components/QrCodeModal.vue';
import ShareModal from '@/components/ShareModal.vue';
import UserInfoModal from '@/components/UserInfoModal.vue';
import { isDarkMode as storeIsDarkMode, toggleDarkMode } from '@/store/theme';
import { setUserInfo, userInfo } from '@/store/user';
import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
import QRCode from 'weapp-qrcode';

const searchText = ref('');
const debounceTimer = ref(null);
const showMenu = ref(false);
const currentBookIndex = ref(-1);
const menuPosition = ref({
	top: '0px',
	right: '32rpx'
});
const showModal = ref(false);
const isEdit = ref(false);
const formData = ref({
	id: '',
	title: '',
	remark: '',
	coverImageUrl: '',
	type: '',
	selectedCoverId: null
});
const loginData = ref({});
const showUserInfoModal = ref(false);

// 列表数据
const bookList = ref([]);
const loading = ref(false);
const isRefreshing = ref(false);
const hasMore = ref(true);
const total = ref(0);

const queryParams = ref({
	pageNum: 1,
	pageSize: 10,
	title: '',
	type: '',
	startTime: '',
	endTime: ''
});

// 主题相关
const isDarkMode = storeIsDarkMode;
const currentTheme = ref(uni.getStorageSync('currentTheme') || 'theme-baby');
const rippleActive = ref(false);
const ripplePosition = ref({ x: 0, y: 0 });

// 主题切换按钮位置
const switchPosition = ref({
	x: 32,
	y: 120
});

// 初始化主题切换按钮位置
const initSwitchPosition = () => {
	const systemInfo = uni.getSystemInfoSync();
	const savedX = uni.getStorageSync('themeSwitchX');
	const savedY = uni.getStorageSync('themeSwitchY');

	// 计算默认位置：右下角，考虑安全区域
	const defaultX = systemInfo.windowWidth - uni.upx2px(112); // 80rpx按钮 + 32rpx边距
	const defaultY = systemInfo.windowHeight - uni.upx2px(200) - (systemInfo.safeAreaInsets?.bottom || 0);

	switchPosition.value = {
		x: savedX || defaultX,
		y: savedY || defaultY
	};
};

// 触摸起始点
const touchStartPoint = ref({ x: 0, y: 0 });
const startPosition = ref({ x: 0, y: 0 });

// 计算按钮样式
const switchStyle = computed(() => {
	return {
		transform: `translate3d(${switchPosition.value.x}px, ${switchPosition.value.y}px, 0)`,
		transition: touchStartPoint.value.x === 0 ? 'transform 0.3s ease' : 'none',
		position: 'fixed',
		zIndex: 90
	}
});

// 计算涟漪样式
const rippleStyle = computed(() => {
	if (!rippleActive.value) return { display: 'none' };

	// 计算涟漪大小（屏幕对角线长度）
	const systemInfo = uni.getSystemInfoSync();
	const maxSize = Math.sqrt(
		Math.pow(systemInfo.windowWidth, 2) +
		Math.pow(systemInfo.windowHeight, 2)
	) * 2;

	return {
		position: 'fixed',
		left: ripplePosition.value.x + 'px',
		top: ripplePosition.value.y + 'px',
		width: maxSize + 'px',
		height: maxSize + 'px',
		transform: `translate(-50%, -50%) scale(${rippleActive.value ? 1 : 0})`,
		backgroundColor: isDarkMode.value ? '#1a1a1a' : '#F6F7FB',
		transition: 'transform 0.6s cubic-bezier(0.4, 0, 0.2, 1)',
		zIndex: 100,
		borderRadius: '50%',
		pointerEvents: 'none'
	};
});

// 初始化暗黑模式状态
const initDarkMode = () => {
	const savedMode = uni.getStorageSync('isDarkMode');
	isDarkMode.value = savedMode === true;
	updateNavigationBarStyle();
};

// 更新导航栏样式
const updateNavigationBarStyle = () => {
	uni.setNavigationBarColor({
		frontColor: isDarkMode.value ? '#ffffff' : '#000000',
		backgroundColor: isDarkMode.value ? '#1a1a1a' : '#F8F8F8',
		animation: {
			duration: 300,
			timingFunc: 'easeIn'
		}
	});
};

// 切换暗黑模式
const toggleTheme = () => {
	toggleDarkMode();
};

// 触摸开始
const touchStart = (e) => {
	const touch = e.touches[0];
	touchStartPoint.value = {
		x: touch.clientX,
		y: touch.clientY
	};
	startPosition.value = {
		x: switchPosition.value.x,
		y: switchPosition.value.y
	};
};

// 触摸移动
const touchMove = (e) => {
	if (touchStartPoint.value.x === 0) return;

	const touch = e.touches[0];
	const deltaX = touch.clientX - touchStartPoint.value.x;
	const deltaY = touch.clientY - touchStartPoint.value.y;

	// 如果移动距离小于5px，不进行移动
	if (Math.abs(deltaX) < 5 && Math.abs(deltaY) < 5) return;

	let newX = startPosition.value.x + deltaX;
	let newY = startPosition.value.y + deltaY;

	// 获取屏幕尺寸并转换单位
	const systemInfo = uni.getSystemInfoSync();
	// 将rpx转换为px
	const buttonSize = uni.upx2px(80);
	const maxX = systemInfo.windowWidth - buttonSize;
	const maxY = systemInfo.windowHeight - buttonSize;

	// 限制在屏幕内
	newX = Math.max(0, Math.min(newX, maxX));
	newY = Math.max(0, Math.min(newY, maxY));

	switchPosition.value = { x: newX, y: newY };
};

// 触摸结束
const touchEnd = (e) => {
	// 如果移动距离很小，视为点击
	const touch = e.changedTouches[0];
	const deltaX = touch.clientX - touchStartPoint.value.x;
	const deltaY = touch.clientY - touchStartPoint.value.y;

	if (Math.abs(deltaX) < 5 && Math.abs(deltaY) < 5) {
		toggleTheme();
		return;
	}

	// 重置触摸起始点
	touchStartPoint.value = { x: 0, y: 0 };

	// 获取屏幕尺寸并转换单位
	const systemInfo = uni.getSystemInfoSync();
	const screenWidth = systemInfo.windowWidth;
	const buttonSize = uni.upx2px(80);
	const maxX = screenWidth - buttonSize;

	// 吸附到最近的边缘
	const finalX = switchPosition.value.x > screenWidth / 2 ? maxX : 0;
	const finalY = switchPosition.value.y;

	// 应用吸附动画
	switchPosition.value = {
		x: finalX,
		y: finalY
	};

	// 保存位置到本地存储
	uni.setStorageSync('themeSwitchX', finalX);
	uni.setStorageSync('themeSwitchY', finalY);
};

// 主题列表
const themes = [
	{ id: 'theme-default', name: '默认主题', colors: { primary: '#8E2DE2', secondary: '#4A00E0' } },
	{ id: 'theme-wedding', name: '婚礼主题', colors: { primary: '#FF9999', secondary: '#FF5E5E' } },
	{ id: 'theme-baby', name: '满月主题', colors: { primary: '#5B9EE7', secondary: '#4A7FBA' } },
];

// 长按主题切换按钮显示主题选择
const showThemeSelect = (e) => {
	// 阻止事件冒泡
	e.stopPropagation();
	// 阻止默认行为
	e.preventDefault();

	uni.showActionSheet({
		itemList: themes.map(theme => theme.name),
		success: (res) => {
			const selectedTheme = themes[res.tapIndex];
			if (selectedTheme && selectedTheme.id !== currentTheme.value) {
				// 只有当选择了不同的主题时才进行切换
				currentTheme.value = selectedTheme.id;
				uni.setStorageSync('currentTheme', selectedTheme.id);

				// 触发涟漪效果
				const touch = e.touches ? e.touches[0] : e;
				ripplePosition.value = {
					x: touch.clientX,
					y: touch.clientY
				};
				rippleActive.value = true;
				setTimeout(() => {
					rippleActive.value = false;
				}, 600);
			}
		}
	});
};

// 监听搜索输入
watch(searchText, (newValue) => {
	// 清除之前的定时器
	if (debounceTimer.value) {
		clearTimeout(debounceTimer.value);
	}

	// 设置新的定时器，300ms 后执行搜索
	debounceTimer.value = setTimeout(() => {
		queryParams.value.title = newValue.trim();
		queryParams.value.pageNum = 1;
		getList();
	}, 300);
});

// 修改获取列表数据的方法
const getList = async (isLoadMore = false) => {
	try {
		if (!isLoadMore) {
			loading.value = true;
		}

		// 构建查询参数
		const params = {
			...queryParams.value,
			title: queryParams.value.title || undefined // 如果为空则不传
		};

		const res = await getGiftBookList(params);
		if (res.code === 200) {
			if (isLoadMore) {
				bookList.value = [...bookList.value, ...(res.data?.records || [])];
			} else {
				bookList.value = res.data?.records || [];
			}
			total.value = res.data?.totalRow || 0;
			hasMore.value = res.data ? (queryParams.value.pageNum < res.data.totalPage) : false;
		} else {
			uni.showToast({
				title: res.msg || '获取列表失败',
				icon: 'none'
			});
		}
	} catch (error) {
		console.error('获取列表失败:', error);
		uni.showToast({
			title: error.message || '获取列表失败',
			icon: 'none'
		});
		// 出错时重置列表数据
		if (!isLoadMore) {
			bookList.value = [];
			total.value = 0;
			hasMore.value = false;
		}
	} finally {
		loading.value = false;
		isRefreshing.value = false;
	}
};

// 下拉刷新
const onRefresh = async () => {
	if (!isLoggedIn.value) {
		uni.showToast({
			title: '请先登录',
			icon: 'none'
		});
		isRefreshing.value = false;
		return;
	}

	isRefreshing.value = true;
	queryParams.value.pageNum = 1;
	await getList();
};

// 加载更多
const loadMore = async () => {
	if (!hasMore.value || loading.value) return;
	queryParams.value.pageNum += 1;
	await getList(true);
};

// 搜索
const handleSearch = () => {
	queryParams.value.title = searchText.value;
	queryParams.value.pageNum = 1;
	getList();
};

// 新建礼簿
const createNewBook = () => {
	// 先重置编辑状态
	isEdit.value = false;

	// 设置今天的日期
	const today = new Date();
	const year = today.getFullYear();
	const month = String(today.getMonth() + 1).padStart(2, '0');
	const day = String(today.getDate()).padStart(2, '0');

	// 重置表单数据
	formData.value = {
		id: '',
		title: '',
		remark: `${year}-${month}-${day}`,
		coverImageUrl: '',
		type: '',
		selectedCoverId: null
	};

	// 设置showModal为true
	nextTick(() => {
		showModal.value = true;
	});
};

// 默认封面数据
const defaultCovers = ref([
	{
		id: 1,
		type: 'image',
		cover: 'https://ai-public.mastergo.com/ai/img_res/4bc6e0954d08457e961ac7f7a5dbeb76.jpg',
		text: '满月酒',
		type_value: 'full_moon_party'
	},
	{
		id: 2,
		type: 'image',
		cover: 'https://ai-public.mastergo.com/ai/img_res/4ae8e25fa8628f8632f38b3b0ed816d2.jpg',
		text: '生日宴',
		type_value: 'birthday_party'
	},
	{
		id: 3,
		type: 'image',
		cover: 'https://ai-public.mastergo.com/ai/img_res/8c5164242859d8412f2368691707e4fd.jpg',
		text: '婚礼',
		type_value: 'wedding'
	},
	{
		id: 4,
		type: 'image',
		cover: 'https://ai-public.mastergo.com/ai/img_res/1305c6599ca80f3b7c2f0d3747297a70.jpg',
		text: '乔迁',
		type_value: 'house_warming'
	},
	{
		id: 5,
		type: 'image',
		cover: 'https://ai-public.mastergo.com/ai/img_res/f37135de135cff1b393609999ee5ba34.jpg',
		text: '白事',
		type_value: 'funeral'
	}
]);

// 修改编辑礼簿方法
const editBook = (index) => {
	const book = bookList.value[index];
	if (!book) return;

	// 先关闭下拉菜单
	closeDropdown();

	// 根据type找到对应的封面ID
	let selectedCoverId = null;
	if (book.type) {
		const matchedCover = defaultCovers.value.find(cover => cover.type_value === book.type);
		if (matchedCover) {
			selectedCoverId = matchedCover.id;
		}
	}

	// 设置编辑状态和表单数据
	isEdit.value = true;
	formData.value = {
		id: book.id,
		title: book.title,
		remark: formatDate(book.createTime),
		coverImageUrl: book.coverImageUrl,
		type: book.type || '',
		selectedCoverId: selectedCoverId
	};

	// 显示模态框
	showModal.value = true;
};

// 删除礼簿
const deleteBook = (index) => {
	const book = bookList.value[index];
	uni.showModal({
		title: '确认删除',
		content: '确定要删除这个礼簿吗？',
		success: async (res) => {
			if (res.confirm) {
				try {
					await deleteGiftBook(book.id);
					uni.showToast({
						title: '删除成功',
						icon: 'success'
					});
					getList(); // 重新获取列表
				} catch (error) {
					uni.showToast({
						title: error.message || '删除失败',
						icon: 'none'
					});
				}
			}
			closeDropdown();
		}
	});
};

// 处理全局点击
const handleGlobalClick = () => {
	closeDropdown();
};

// 日期选择
const onDateChange = (e) => {
	formData.value.remark = e.detail.value;
};

// 修改选择自定义封面的方法
const chooseCover = async () => {
	try {
		const url = await chooseAndUploadImage({});

		// 更新封面图片地址
		formData.value.coverImageUrl = url;
		formData.value.type = 'other';
		formData.value.selectedCoverId = null; // 清除默认封面的选中状态

		uni.showToast({
			title: '上传成功',
			icon: 'success'
		});
	} catch (error) {
		console.error('上传失败：', error);
		uni.showToast({
			title: error.message || '上传失败',
			icon: 'none'
		});
	}
};

// 处理封面点击
const handleCoverClick = async (coverId) => {
	const selectedCover = defaultCovers.value.find(c => c.id === coverId);
	if (selectedCover) {
		// 如果已经选中，则打开上传
		if (formData.value.selectedCoverId === coverId) {
			try {
				const url = await chooseAndUploadImage({});
				// 更新封面图片地址，保持原有的 type 不变
				formData.value.coverImageUrl = url;

				uni.showToast({
					title: '更换成功',
					icon: 'success'
				});
			} catch (error) {
				uni.showToast({
					title: error.message || '上传失败',
					icon: 'none'
				});
			}
		} else {
			// 否则选中该封面
			selectCover(coverId);
		}
	}
};

// 格式化日期
const formatDate = (dateString) => {
	if (!dateString) return '';
	const date = new Date(dateString);
	const year = date.getFullYear();
	const month = String(date.getMonth() + 1).padStart(2, '0');
	const day = String(date.getDate()).padStart(2, '0');
	return `${year}-${month}-${day}`;
};

// 跳转到详情页
const navigateToDetail = (book) => {
	uni.navigateTo({
		url: `/pages/book/detail?id=${book.id}`
	});
};

// 处理扫码
const handleScan = async () => {
	try {
		const scanResult = await new Promise((resolve, reject) => {
			uni.scanCode({
				success: (res) => resolve(res),
				fail: (err) => reject(err)
			});
		});
		console.log('scanResult', scanResult);
		const res = await receiveShare({ shareId: scanResult.result });
		if (res.code === 200) {
			uni.showToast({
				title: '接收成功',
				icon: 'success'
			});
			await Promise.all([getList(), getDashboardData()]);
		}
	} catch (error) {
		console.error('处理失败:', error);
	}
}

// 清空搜索
const clearSearch = () => {
	searchText.value = '';
	queryParams.value.title = '';
	queryParams.value.pageNum = 1;
	getList();
};

// 处理滚动事件
const handleScroll = () => {
	if (showMenu.value) {
		closeDropdown();
	}
};

// 添加动画状态变量
const isClosingModal = ref(false);

// 添加分享类型变量

// 选择分享类型

// 修改分享相关的变量和方法

// 增加分享人数

// 减少分享人数

// 添加二维码URL的响应式变量
const showShareModal = ref(false);
const showQrCodeModal = ref(false);
const currentShareBookId = ref('');
const qrCodeUrl = ref('');
const shareType = ref('wechat'); // 默认分享类型
const shareNumber = ref(1); // 默认分享人数

// 分享礼簿
const shareBook = (index) => {
	const book = bookList.value[index];
	if (!book) return;

	// 先关闭下拉菜单
	closeDropdown();

	// 重置分享数据到默认状态，然后设置当前要分享的礼簿ID
	currentShareBookId.value = book.id;

	// 显示分享模态框
	showShareModal.value = true;
};

// 处理二维码生成
const handleQrCode = (url) => {
	qrCodeUrl.value = url;
	showQrCodeModal.value = true;
};

// 关闭分享弹框
const closeShareModal = () => {

	// 关闭弹框
	showShareModal.value = false;
};

// 关闭二维码弹框
const closeQrCodeModal = () => {
	showQrCodeModal.value = false;
	qrCodeUrl.value = '';
};

// 修改显示二维码的方法

// 修改获取二维码URL的方法
const getQrCodeUrl = () => {
	// 构建分享链接
	const qrContent = `/pages/index/index?bookId=${currentShareBookId.value}&type=${shareType.value}&number=${shareNumber.value}`;

	return new Promise((resolve, reject) => {
		try {
			// 创建QR码实例并直接绘制
			new QRCode({
				width: 400,  // 增大尺寸
				height: 400, // 增大尺寸
				canvasId: 'qrcode',
				text: qrContent,
				foreground: '#000000',
				background: '#ffffff',
				padding: 20,
				callback: (res) => {
					// 获取canvas实例
					uni.canvasToTempFilePath({
						canvasId: 'qrcode',
						width: 400,
						height: 400,
						destWidth: 800,  // 增加输出图片质量
						destHeight: 800, // 增加输出图片质量
						success: (res) => {
							resolve(res.tempFilePath);
						},
						fail: (err) => {
							console.error('生成二维码失败:', err);
							reject(err);
						}
					});
				}
			});
		} catch (error) {
			console.error('创建二维码失败:', error);
			reject(error);
		}
	});
};

// 修改分享到微信的方法
const shareToWechat = async () => {
	try {
		const qrCodePath = await getQrCodeUrl();
		// 保存到相册后提示用户从相册分享
		uni.saveImageToPhotosAlbum({
			filePath: qrCodePath,
			success: () => {
				uni.showToast({
					title: '已保存到相册，请从相册分享',
					icon: 'none',
					duration: 2000
				});
			},
			fail: () => {
				uni.showToast({
					title: '保存失败',
					icon: 'none'
				});
			}
		});
	} catch (error) {
		console.error('分享失败:', error);
		uni.showToast({
			title: '分享失败',
			icon: 'none'
		});
	}
};

// 修改保存二维码的方法
const saveQrCode = async () => {
	try {
		const qrCodePath = await getQrCodeUrl();
		uni.saveImageToPhotosAlbum({
			filePath: qrCodePath,
			success: () => {
				uni.showToast({
					title: '保存成功',
					icon: 'success'
				});
			},
			fail: () => {
				uni.showToast({
					title: '保存失败',
					icon: 'none'
				});
			}
		});
	} catch (error) {
		console.error('保存失败:', error);
		uni.showToast({
			title: '保存失败',
			icon: 'none'
		});
	}
};

// 修改处理遮罩层点击的方法
const handleOverlayClick = () => {
	if (showModal.value) {
		showModal.value = false;
		isEdit.value = false;
	}
	if (showShareModal.value) {
		closeShareModal();
	}
	if (showQrCodeModal.value) {
		closeQrCodeModal();
	}
};

// 添加登录状态
const isLoggedIn = ref(false);

// 修改登录处理方法
const handleLogin = async () => {
	try {
		uni.showLoading({
			title: '登录中...',
			mask: true
		});

		// 调用微信登录
		const loginRes = await uni.login({
			provider: 'weixin'
		});

		const code = loginRes.code;
		if (!code) {
			throw new Error('获取微信授权码失败');
		}

		// 调用后端登录接口
		const res = await getOpenId(code);

		if (res.code === 200 && res.data) {
			// 存储用户信息
			setUserInfo(res.data);
			isLoggedIn.value = true;
			// 如果需要完善用户信息，显示用户信息填写弹窗
			if (!res.data.nickname || !res.data.avatar) {
				loginData.value = res.data;
				showUserInfoModal.value = true;
			} else {
				// 获取礼簿列表和统计数据
				await Promise.all([getList(), getDashboardData()]);

				uni.showToast({
					title: '登录成功',
					icon: 'success'
				});
			}
		} else {
			throw new Error(res.msg || '登录失败');
		}
	} catch (error) {
		uni.hideLoading();
		uni.showToast({
			title: error.message || '登录失败',
			icon: 'error'
		});
		console.error('登录失败:', error);
	} finally {
		uni.hideLoading();
	}
};

// 处理用户信息提交
const handleUserInfoSubmit = async (userInfo) => {
	try {
		// 更新用户信息
		setUserInfo({
			...loginData.value,
			...userInfo
		});

		// 关闭弹窗
		showUserInfoModal.value = false;

		// 获取礼簿列表和统计数据
		await Promise.all([getList(), getDashboardData()]);

		uni.showToast({
			title: '信息完善成功',
			icon: 'success'
		});
	} catch (error) {
		uni.showToast({
			title: '信息完善失败',
			icon: 'error'
		});
		console.error('完善用户信息失败:', error);
	}
};

// 添加统计数据的响应式变量
const dashboardData = ref({
	guestCount: 0,
	totalAmount: 0
});

// 获取统计数据
const getDashboardData = async () => {
	try {
		const res = await getGiftBookDashboard();
		if (res.code === 200 && res.data) {

			dashboardData.value = res.data;
			if (dashboardData.value.totalAmount === null) {
				dashboardData.value.totalAmount = 0;
			}

		}
	} catch (error) {
		console.error('获取统计数据失败:', error);
	}
};

// 添加分享相关的响应式变量

onMounted(() => {
	// 检查登录状态
	const token = uni.getStorageSync('token');
	isLoggedIn.value = !!token;

	initDarkMode();
	initSwitchPosition(); // 初始化主题切换按钮位置

	// 使用 uni.getSystemInfo 获取状态栏高度
	// uni.getSystemInfo({
	// 	success: (res) => {
	// 		// 直接使用 CSS 变量设置状态栏高度
	// 		document.documentElement.style.setProperty('--status-bar-height', `${res.statusBarHeight}px`);
	// 	},
	// 	fail: (err) => {
	// 		console.error('获取系统信息失败:', err);
	// 		// 设置一个默认值
	// 		document.documentElement.style.setProperty('--status-bar-height', '44px');
	// 	}
	// });

	// 获取列表数据和统计数据
	if (isLoggedIn.value) {
		getList();
		getDashboardData();
	}
});

onUnmounted(() => {
	uni.removeStorageSync('shareConfig');
});

// 页面卸载时清除分享配置
onUnmounted(() => {
	uni.removeStorageSync('shareConfig');
});

// 添加页面的分享配置
defineExpose({
	onShareAppMessage() {
		// 返回分享配置
		return {
			title: globalData.shareConfig?.title || '礼簿分享',
			path: globalData.shareConfig?.path || '/pages/index/index',
			imageUrl: globalData.shareConfig?.imageUrl || ''
		};
	},
	onShareTimeline() {
		// 返回朋友圈分享配置
		return {
			title: globalData.shareConfig?.title || '礼簿分享',
			query: globalData.shareConfig?.path?.split('?')[1] || '',
			imageUrl: globalData.shareConfig?.imageUrl || ''
		};
	}
});

// 添加全局数据对象
const globalData = {
	shareConfig: null
};

// 添加关闭二维码弹窗的方法

// 显示下拉菜单
const showDropdown = (event, index) => {
	// 如果菜单已经显示，则关闭它
	if (showMenu.value && currentBookIndex.value === index) {
		closeDropdown();
		return;
	}

	const query = uni.createSelectorQuery();
	query.selectAll('.book-more').boundingClientRect(data => {
		if (data && data[index]) {
			const rect = data[index];
			menuPosition.value = {
				top: `${rect.bottom}px`,
				right: '32rpx'
			};
			currentBookIndex.value = index;
			showMenu.value = true;
		}
	}).exec();
};

// 关闭下拉菜单
const closeDropdown = () => {
	if (showMenu.value) {
		showMenu.value = false;
		currentBookIndex.value = -1;
	}
};

// 添加处理下拉菜单项点击的方法
const handleDropdownItemClick = (handler, index) => {
	handler(index);
};

// 监听showModal的变化
watch(() => showModal.value, (newVal) => {
	console.log('showModal changed:', newVal);
}, { immediate: true });

// 添加计算属性用于动态设置 placeholder 颜色
const placeholderColor = computed(() => {
	return isDarkMode.value ? 'rgba(255, 255, 255, 0.3)' : '#AAAAAA';
});

// 添加用户信息弹窗的响应式变量

</script>

<style>
.container {
	min-height: 100vh;
	height: 100vh;
	background: var(--theme-background);
	padding: 0;
	display: flex;
	flex-direction: column;
	transition: all 0.3s ease;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	box-sizing: border-box;
	overflow: hidden;
}

/* 主题颜色 - 亮色模式 */
.theme-default {
	--theme-primary: #8E2DE2;
	--theme-secondary: #4A00E0;
	--theme-gradient: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	--theme-background: #FFFFFF;
	--theme-card: #FFFFFF;
	--theme-text: #333333;
	--theme-text-secondary: #666666;
	--theme-text-light: #999999;
	--theme-primary-light: rgba(142, 45, 226, 0.08);
	--theme-primary-border: rgba(142, 45, 226, 0.15);
	--theme-switch-bg: #FFFFFF;
	--theme-switch-text: #000000;
	--theme-switch-border: rgba(0, 0, 0, 0.1);
	--theme-switch-shadow: rgba(0, 0, 0, 0.15);
}

.theme-wedding {
	--theme-primary: #FF9999;
	--theme-secondary: #FF5E5E;
	--theme-gradient: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	--theme-background: #FFFFFF;
	--theme-card: #FFFFFF;
	--theme-text: #333333;
	--theme-text-secondary: #666666;
	--theme-text-light: #999999;
	--theme-primary-light: rgba(255, 153, 153, 0.08);
	--theme-primary-border: rgba(255, 153, 153, 0.15);
	--theme-switch-bg: #FFFFFF;
	--theme-switch-text: #000000;
	--theme-switch-border: rgba(0, 0, 0, 0.1);
	--theme-switch-shadow: rgba(0, 0, 0, 0.15);
}

.theme-baby {
	--theme-primary: #5B9EE7;
	--theme-secondary: #4A7FBA;
	--theme-gradient: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	--theme-background: var(--theme-background);
	--theme-card: #FFFFFF;
	--theme-text: #333333;
	--theme-text-secondary: #666666;
	--theme-text-light: #999999;
	--theme-primary-light: rgba(91, 158, 231, 0.08);
	--theme-primary-border: rgba(91, 158, 231, 0.15);
	--theme-switch-bg: #FFFFFF;
	--theme-switch-text: #000000;
	--theme-switch-border: rgba(0, 0, 0, 0.1);
	--theme-switch-shadow: rgba(0, 0, 0, 0.15);
}

/* 主题颜色 - 暗黑模式 */
.dark-mode.theme-default {
	--theme-primary: #8E2DE2;
	--theme-secondary: #4A00E0;
	--theme-gradient: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	--theme-background: #1A1A1A;
	--theme-card: #2D2D2D;
	--theme-text: #FFFFFF;
	--theme-text-secondary: #BBBBBB;
	--theme-text-light: #888888;
	--theme-primary-light: rgba(142, 45, 226, 0.15);
	--theme-primary-border: rgba(142, 45, 226, 0.25);
	--theme-switch-bg: var(--theme-card);
	--theme-switch-text: #FFFFFF;
	--theme-switch-border: rgba(255, 255, 255, 0.2);
	--theme-switch-shadow: rgba(0, 0, 0, 0.4);
}

.dark-mode.theme-wedding {
	--theme-primary: #FF9999;
	--theme-secondary: #FF5E5E;
	--theme-gradient: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	--theme-background: #1A1A1A;
	--theme-card: #2D2D2D;
	--theme-text: #FFFFFF;
	--theme-text-secondary: #BBBBBB;
	--theme-text-light: #888888;
	--theme-primary-light: rgba(255, 153, 153, 0.15);
	--theme-primary-border: rgba(255, 153, 153, 0.25);
	--theme-switch-bg: var(--theme-card);
	--theme-switch-text: #FFFFFF;
	--theme-switch-border: rgba(255, 255, 255, 0.2);
	--theme-switch-shadow: rgba(0, 0, 0, 0.4);
}

.dark-mode.theme-baby {
	--theme-primary: #5B9EE7;
	--theme-secondary: #4A7FBA;
	--theme-gradient: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	--theme-background: #1A1A1A;
	--theme-card: #2D2D2D;
	--theme-text: #FFFFFF;
	--theme-text-secondary: #BBBBBB;
	--theme-text-light: #888888;
	--theme-primary-light: rgba(91, 158, 231, 0.15);
	--theme-primary-border: rgba(91, 158, 231, 0.25);
	--theme-switch-bg: var(--theme-card);
	--theme-switch-text: #FFFFFF;
	--theme-switch-border: rgba(255, 255, 255, 0.2);
	--theme-switch-shadow: rgba(0, 0, 0, 0.4);
}

/* 主题切换按钮样式 */
.theme-switch {
	position: fixed;
	width: 80rpx;
	height: 80rpx;
	background: var(--theme-switch-bg);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8rpx 24rpx var(--theme-switch-shadow);
	transition: all 0.3s ease;
	z-index: 90;
	pointer-events: auto;
	border: 2rpx solid var(--theme-switch-border);
}

.theme-icon {
	font-size: 40rpx;
	color: var(--theme-switch-text);
	line-height: 1;
}

.theme-switch:active {
	transform: scale(0.95);
	box-shadow: 0 4rpx 12rpx var(--theme-switch-shadow);
}

.theme-ripple {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--theme-background);
	border-radius: 50%;
	transform: scale(0);
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 999;
	pointer-events: none;
}

/* 暗黑模式适配 */
.dark-mode .header {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 100%);
}

.dark-mode .title {
	background: linear-gradient(135deg, #FFFFFF, #BBBBBB);
	-webkit-background-clip: text;
}

.dark-mode .subtitle {
	color: #BBBBBB;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	/* 半透明白色背景 */
	border-color: rgba(255, 255, 255, 0.12);
	/* 更明显的边框 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.24);
	/* 加深阴影 */
}

.dark-mode .search-input {
	color: #FFFFFF;
	background: transparent;
	caret-color: #FFFFFF;
}

.dark-mode .search-placeholder {
	color: rgba(255, 255, 255, 0.5);
	/* 调整占位符颜色 */
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.7);
	/* 调整图标颜色 */
	opacity: 1;
}

.dark-mode .clear-icon,
.dark-mode .scan-icon {
	color: rgba(255, 255, 255, 0.7);
	/* 调整清除和扫码图标颜色 */
}

.dark-mode .book-item {
	background: var(--theme-card);
	border-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .book-title {
	color: #FFFFFF;
}

.dark-mode .book-date {
	color: #888888;
}

.dark-mode .book-more {
	color: #888888;
}

.dark-mode .dropdown-menu {
	background: var(--theme-card);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.3);
}

.dark-mode .dropdown-menu::before,
.dark-mode .dropdown-menu::after {
	border-color: transparent transparent var(--theme-card) transparent;
}

.dark-mode .dropdown-item {
	color: #FFFFFF;
}

.dark-mode .dropdown-item:active {
	background: rgba(255, 255, 255, 0.08);
}

.dark-mode .modal-content {
	background: var(--theme-card);
}

.dark-mode .modal-title {
	color: #FFFFFF;
}

.dark-mode .form-label {
	color: #BBBBBB;
}

.dark-mode .form-input,
.dark-mode .form-picker,
.dark-mode .form-textarea {
	background: rgba(255, 255, 255, 0.08);
	color: #FFFFFF;
	border-color: rgba(255, 255, 255, 0.1);
}

.dark-mode .form-input:focus,
.dark-mode .form-textarea:focus {
	border-color: var(--theme-primary);
	background: rgba(255, 255, 255, 0.08);
}

.dark-mode .modal-btn.cancel {
	background: rgba(255, 255, 255, 0.1);
	color: #FFFFFF;
}

/* 头部样式 */
.header {
	padding: 0 32rpx;
	padding-top: calc(var(--status-bar-height) + 16rpx);
	background: linear-gradient(180deg, rgba(64, 128, 255, 0.08) 0%, rgba(64, 128, 255, 0) 100%);
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	z-index: 10;
}

.header::before {
	content: '';
	position: absolute;
	right: -100rpx;
	top: -100rpx;
	width: 400rpx;
	height: 400rpx;
	background: radial-gradient(circle, rgba(64, 128, 255, 0.06) 0%, rgba(64, 128, 255, 0) 70%);
	border-radius: 50%;
	z-index: 0;
}

.header-main {
	padding-right: 120rpx;
	padding-bottom: 24rpx;
	position: relative;
	z-index: 1;
}

.title-wrapper {
	display: flex;
	flex-direction: column;
	gap: 8rpx;
	position: relative;
}

.title {
	font-size: 56rpx;
	font-weight: 800;
	background: linear-gradient(135deg, #4080FF, #5B9EE7);
	-webkit-background-clip: text;
	color: transparent;
	letter-spacing: 2rpx;
	position: relative;
	display: inline-block;
	padding-right: 60rpx;
}

.title::after {
	content: '📖';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 40rpx;
	background: none;
	-webkit-background-clip: unset;
	color: inherit;
	opacity: 0.8;
}

.subtitle {
	font-size: 26rpx;
	color: #666666;
	margin-left: 4rpx;
	letter-spacing: 1rpx;
}

/* 搜索框样式调整 */
.search-wrapper {
	padding: 0 32rpx;
	margin-bottom: 24rpx;
	flex-shrink: 0;
	position: relative;
	z-index: 10;
	background: var(--theme-background);
	transition: all 0.3s ease;
}

.search-bar {
	height: 88rpx;
	/* background: var(--theme-card); */
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	padding: 0 32rpx;
	box-shadow: 0 4rpx 16rpx var(--theme-primary-light);
	border: 2rpx solid var(--theme-primary-border);
	/* transition: background-color 0.6s cubic-bezier(0.4, 0, 0.2, 1),
		border-color 0.6s cubic-bezier(0.4, 0, 0.2, 1),
		box-shadow 0.6s cubic-bezier(0.4, 0, 0.2, 1); */
}

.search-input {
	flex: 1;
	height: 88rpx;
	font-size: 32rpx;
	margin-left: 20rpx;
	color: var(--theme-text);
	background: transparent;
	transition: color 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	caret-color: var(--theme-primary);
}

.search-input::placeholder {
	color: var(--theme-text-light);
	opacity: 0.5;
	transition: color 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-icon,
.scan-icon,
.clear-icon {
	color: #999999 !important;
	/* 添加 !important 确保颜色不被覆盖 */
	opacity: 0.8;
	background: transparent;
	font-size: 40rpx;
}

.clear-icon {
	font-size: 36rpx;
	padding: 16rpx;
	margin-right: -8rpx;
}

.scan-icon {
	font-size: 44rpx;
	padding: 16rpx;
	margin-right: -16rpx;
	color: #999999;
}

/* 移除旧的 placeholder 样式 */
.search-placeholder {
	transition: all 0.3s ease;
}

/* 暗黑模式搜索框适配 */
.dark-mode .search-bar {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.24);
}

.dark-mode .search-input {
	color: var(--theme-text);
	background: transparent;
	caret-color: var(--theme-primary);
}

.dark-mode .search-icon,
.dark-mode .scan-icon,
.dark-mode .clear-icon {
	background: transparent;
	color: rgba(255, 255, 255, 0.6) !important;
}

.dark-mode .search-placeholder {
	color: rgba(255, 255, 255, 0.3);
}

.dark-mode .search-bar:focus-within {
	border-color: var(--theme-primary);
	box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.3);
}

.add-icon {
	display: none;
}

/* 统计卡片 */
.stats-card {
	margin: 24rpx 32rpx 32rpx;
	padding: 40rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 24rpx;
	color: #FFFFFF;
	box-shadow: 0 8rpx 24rpx rgba(91, 158, 231, 0.15);
	flex-shrink: 0;
	position: relative;
	z-index: 10;
}

.stats-row {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	position: relative;
}

.stats-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8rpx;
	flex: 1;
	padding: 0 20rpx;
	position: relative;
}

/* 添加分隔线 */
.stats-item:first-child::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 2rpx;
	height: 60%;
	background: linear-gradient(to bottom,
			transparent 0%,
			transparent 10%,
			rgba(255, 255, 255, 0.2) 10%,
			rgba(255, 255, 255, 0.2) 20%,
			rgba(255, 255, 255, 0.4) 20%,
			rgba(255, 255, 255, 0.4) 80%,
			rgba(255, 255, 255, 0.2) 80%,
			rgba(255, 255, 255, 0.2) 90%,
			transparent 90%,
			transparent 100%);
}

.stats-label {
	font-size: 28rpx;
	color: rgba(255, 255, 255, 0.9);
	letter-spacing: 1rpx;
}

.stats-value {
	font-size: 48rpx;
	line-height: 1.2;
	font-weight: 600;
	color: #FFFFFF;
	margin-top: 8rpx;
	font-family: 'DIN Alternate', Arial, sans-serif;
	text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* 移除不需要的样式 */
.stats-btn {
	display: none;
}

/* 礼簿列表 */
.book-list {
	flex: 1;
	height: auto;
	padding: 0 32rpx;
	box-sizing: border-box;
	position: relative;
	z-index: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.book-item {
	margin-bottom: 24rpx;
	padding: 24rpx;
	background: #FFFFFF;
	border-radius: 20rpx;
	box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	transition: all 0.3s ease;
	border: 2rpx solid rgba(91, 158, 231, 0.05);
}

.book-item:active {
	transform: scale(0.99);
	box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}

.book-main {
	flex: 1;
	display: flex;
	gap: 24rpx;
}

.book-cover {
	width: 140rpx;
	height: 140rpx;
	border-radius: 16rpx;
	overflow: hidden;
	background: #F5F7FA;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
}

.book-cover image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.book-info {
	flex: 1;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.book-title {
	font-size: 32rpx;
	color: #333333;
	font-weight: 600;
	margin-bottom: 4rpx;
}

.book-date {
	font-size: 24rpx;
	color: #999999;
	margin-bottom: 16rpx;
}

.book-stats {
	display: flex;
	align-items: center;
	gap: 12rpx;
	width: 100%;
	margin-top: auto;
}

.book-amount {
	display: flex;
	align-items: center;
	flex: 1;
	background: rgba(91, 158, 231, 0.08);
	padding: 12rpx 20rpx;
	border-radius: 12rpx;
	width: 0;
}

.amount-label {
	font-size: 24rpx;
	color: #666666;
	flex-shrink: 0;
	margin-right: 8rpx;
}

.amount-value {
	font-size: 32rpx;
	color: #4080FF;
	font-weight: 600;
	font-family: 'DIN Alternate', sans-serif;
	text-align: right;
	flex: 1;
	min-width: 0;
}

.guest-count {
	display: inline-flex;
	align-items: center;
	height: 52rpx;
	padding: 0 20rpx;
	background: rgba(91, 158, 231, 0.08);
	border-radius: 26rpx;
	white-space: nowrap;
	flex-shrink: 0;
}

.guest-count .count {
	color: #4080FF;
	font-size: 28rpx;
	font-weight: 600;
	font-family: 'DIN Alternate', sans-serif;
	margin-right: 4rpx;
}

.guest-count text {
	color: #666666;
	font-size: 24rpx;
}

.guest-count:active {
	background: rgba(91, 158, 231, 0.12);
}

.book-more {
	width: 80rpx;
	height: 80rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 40rpx;
	color: #999999;
	margin: -16rpx -12rpx 0 0;
	border-radius: 50%;
}

.book-more:active {
	background: rgba(0, 0, 0, 0.04);
}

/* 悬浮按钮 */
.float-btn {
	position: fixed;
	right: 40rpx;
	bottom: calc(40rpx + env(safe-area-inset-bottom));
	z-index: 100;
	width: 120rpx;
	height: 120rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8rpx 24rpx rgba(91, 158, 231, 0.25);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	animation: fadeIn 0.3s ease;
}

.float-btn:active {
	transform: scale(0.92);
	box-shadow: 0 4rpx 12rpx rgba(91, 158, 231, 0.2);
}

.plus-icon {
	font-size: 48rpx;
	color: #FFFFFF;
}

/* 下拉菜单样式 */
.dropdown-menu {
	position: fixed;
	background: var(--theme-card);
	border-radius: 16rpx;
	box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.12);
	padding: 12rpx;
	z-index: 100;
	min-width: 240rpx;
	border: 2rpx solid var(--theme-primary-border);
	transform-origin: top right;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
	transform: scale(0.95) translateY(-10rpx);
}

.dropdown-menu.visible {
	opacity: 1;
	visibility: visible;
	transform: scale(1) translateY(0);
}

/* 遮罩层样式 */
.modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 95;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.modal-overlay.visible {
	opacity: 1;
	visibility: visible;
}

/* 修改弹框层级 */
.modal {
	z-index: 999;
}

.share-modal {
	z-index: 999;
}

/* 使用伪元素创建两个三角形，一个作为边框，一个作为背景 */
.dropdown-menu::before,
.dropdown-menu::after {
	content: '';
	position: absolute;
	right: 24rpx;
	border-style: solid;
}

/* 外层三角形（边框） */
.dropdown-menu::before {
	top: -18rpx;
	border-width: 0 18rpx 18rpx 18rpx;
	border-color: transparent transparent var(--theme-primary-border) transparent;
}

/* 内层三角形（背景） */
.dropdown-menu::after {
	top: -16rpx;
	border-width: 0 16rpx 16rpx 16rpx;
	border-color: transparent transparent var(--theme-card) transparent;
	z-index: 1;
}

/* 暗黑模式适配 */
.dark-mode .dropdown-menu {
	background: var(--theme-card);
	border: 2rpx solid var(--theme-primary-border);
	box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.3);
}

.dark-mode .dropdown-menu::before {
	border-color: transparent transparent var(--theme-primary-border) transparent;
}

.dark-mode .dropdown-menu::after {
	border-color: transparent transparent var(--theme-card) transparent;
}

.dropdown-item {
	display: flex;
	align-items: center;
	gap: 16rpx;
	padding: 24rpx;
	font-size: 28rpx;
	color: var(--theme-text);
	transition: all 0.2s ease;
	border-radius: 8rpx;
}

.dropdown-item:active {
	background: var(--theme-primary-light);
}

.dropdown-icon {
	font-size: 36rpx;
	color: var(--theme-text);
}

.dropdown-item.delete {
	color: #FF4D4F;
}

.dropdown-item.delete .dropdown-icon {
	color: #FF4D4F;
}

.dropdown-item.delete:active {
	background: rgba(255, 77, 79, 0.1);
}

/* 弹框样式 */
.modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: v-bind('isClosingModal ? "fadeOut 0.3s ease" : "fadeIn 0.3s ease"');
}

.modal-content {
	width: 666rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
	animation: v-bind('isClosingModal ? "slideDown 0.3s ease" : "slideDown 0.3s ease reverse"');
	transform-origin: center;
}

.modal-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid #EEEEEE;
}

.modal-title {
	font-size: 36rpx;
	font-weight: 600;
	color: #333333;
}

.modal-close {
	font-size: 48rpx;
	color: #999999;
	padding: 0 20rpx;
}

.modal-body {
	padding: 32rpx;
	max-height: 800rpx;
	overflow-y: auto;
	overflow-x: hidden;
	/* 防止水平滚动 */
}

.modal-form-item {
	margin-bottom: 24rpx;
	overflow: visible;
	/* 确保表单项不会被截断 */
}

.form-label {
	font-size: 28rpx;
	color: #666666;
	margin-bottom: 12rpx;
	display: block;
}

.form-input {
	width: 100%;
	height: 80rpx;
	background: #F8F9FC;
	border-radius: 12rpx;
	padding: 0 24rpx;
	font-size: 28rpx;
	color: #333333;
	box-sizing: border-box;
	border: 2rpx solid transparent;
}

.form-input:focus {
	border-color: #4080FF;
	background: #FFFFFF;
}

.form-picker {
	width: 100%;
	height: 80rpx;
	background: #F8F9FC;
	border-radius: 12rpx;
	padding: 0;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	border: 2rpx solid transparent;
}

.picker-text {
	font-size: 28rpx;
	color: var(--theme-text);
	width: 100%;
	height: 100%;
	line-height: 80rpx;
	padding: 0 24rpx;
}

.picker-text.placeholder {
	color: var(--theme-text-light);
}

/* 暗黑模式适配 */
.dark-mode .picker-text {
	color: var(--theme-text);
}

.dark-mode .picker-text.placeholder {
	color: var(--theme-text-light);
}

.cover-upload {
	width: 100%;
	height: 240rpx;
	background: #F8F9FC;
	border-radius: 12rpx;
	overflow: hidden;
}

.cover-image {
	width: 100%;
	height: 100%;
}

.upload-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.upload-icon {
	font-size: 48rpx;
	color: #999999;
	margin-bottom: 8rpx;
}

.upload-text {
	font-size: 24rpx;
	color: #666666;
}

.modal-footer {
	padding: 24rpx 32rpx;
	display: flex;
	justify-content: flex-end;
	gap: 20rpx;
	border-top: 1rpx solid #EEEEEE;
}

.modal-btn {
	padding: 20rpx 40rpx;
	border-radius: 8rpx;
	font-size: 28rpx;
	transition: all 0.2s ease;
}

.modal-btn.cancel {
	background: #F5F5F5;
	color: #666666;
}

.modal-btn.confirm {
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	color: #FFFFFF;
}

.modal-btn:active {
	opacity: 0.8;
}

/* 添加必填项样式 */
.required {
	color: #FF4D4F;
	margin-left: 4rpx;
}

/* 修改下拉菜单样式 */
.dropdown-menu {
	position: fixed;
	background: #FFFFFF;
	border-radius: 16rpx;
	box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.12);
	padding: 12rpx;
	z-index: 100;
	min-width: 240rpx;
	right: 32rpx;
}

.dropdown-menu::after {
	content: '';
	position: absolute;
	top: -16rpx;
	right: 24rpx;
	border-style: solid;
	border-width: 0 16rpx 16rpx 16rpx;
	border-color: transparent transparent #FFFFFF transparent;
	filter: drop-shadow(0 -2rpx 2rpx rgba(0, 0, 0, 0.06));
}

/* 封面选择样式 */
.cover-options {
	margin-top: 12rpx;
	overflow: hidden;
	/* 防止滚动溢出 */
}

.cover-scroll {
	width: 100%;
	white-space: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
	/* 防止垂直滚动 */
	-webkit-overflow-scrolling: touch;
	/* 隐藏滚动条但保持可滚动 */
	scrollbar-width: none;
	/* Firefox */
	-ms-overflow-style: none;
	/* IE and Edge */
}

.cover-scroll::-webkit-scrollbar {
	display: none;
	/* Chrome, Safari and Opera */
}

.cover-list {
	display: inline-flex;
	padding: 12rpx 4rpx;
	gap: 20rpx;
	/* 移除之前的 white-space: nowrap，因为已经在父元素设置 */
}

.cover-item {
	width: 160rpx;
	height: 200rpx;
	border-radius: 12rpx;
	overflow: visible;
	position: relative;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12rpx;
	transition: all 0.3s ease;
}

.cover-preview {
	width: 160rpx;
	height: 160rpx;
	border-radius: 12rpx;
	overflow: hidden;
	border: 4rpx solid transparent;
	box-sizing: border-box;
	transition: all 0.3s ease;
	position: relative;
	background-size: cover;
	background-position: center;
}

.cover-mask {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: all 0.3s ease;
	z-index: 2;
}

.cover-mask-text {
	color: #FFFFFF;
	font-size: 24rpx;
	text-align: center;
	transform: translateY(10rpx);
	transition: all 0.3s ease;
}

.cover-item.active .cover-mask {
	opacity: 1;
}

.cover-item.active .cover-mask-text {
	transform: translateY(0);
}

.cover-text {
	color: #666666;
	font-size: 24rpx;
	font-weight: 500;
	transition: all 0.3s ease;
	text-align: center;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* 选中状态样式 */
.cover-item.active .cover-preview {
	border-color: #4080FF;
	box-shadow: 0 8rpx 16rpx rgba(64, 128, 255, 0.2);
	transform: translateY(-4rpx);
}

.cover-item.active .cover-text {
	color: #4080FF;
	font-weight: 600;
}

/* 点击状态 */
.cover-item:active .cover-preview {
	transform: scale(0.95);
}

.cover-item.active:active .cover-mask {
	background: rgba(0, 0, 0, 0.6);
}

/* 自定义上传按钮样式 */
.cover-item.upload .cover-preview {
	background: var(--theme-background);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: 2rpx dashed rgba(64, 128, 255, 0.3);
	position: relative;
}

.dark-mode .cover-item.upload .cover-preview {
	background: var(--theme-card);
	border: 2rpx dashed rgba(255, 255, 255, 0.2);
}

.cover-item.upload .cover-preview.uploaded {
	background-size: cover !important;
	background-position: center !important;
	border: 4rpx solid var(--theme-primary) !important;
	display: block;
}

.cover-item.upload .cover-preview.uploaded .upload-icon,
.cover-item.upload .cover-preview.uploaded .upload-text {
	display: none;
}

.upload-icon {
	font-size: 48rpx;
	color: var(--theme-primary);
	opacity: 0.8;
	margin-bottom: 8rpx;
}

.upload-text {
	font-size: 24rpx;
	color: var(--theme-text-secondary);
}

.cover-item.upload:active .cover-preview {
	background: var(--theme-background);
	border-color: var(--theme-primary);
}

.dark-mode .cover-item.upload:active .cover-preview {
	background: var(--theme-card);
	border-color: var(--theme-primary);
}

.cover-item.upload .cover-preview.uploaded:active {
	background: initial !important;
	border-color: var(--theme-primary) !important;
}

/* 修改选中状态的遮罩层样式 */
.cover-item.upload .cover-preview.uploaded .cover-mask {
	opacity: 0;
}

.cover-item.upload .cover-preview.uploaded:hover .cover-mask {
	opacity: 1;
}

/* 列表状态样式 */
.list-status {
	padding: 40rpx 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.status-text {
	font-size: 28rpx;
	color: #999999;
}

.empty-status {
	padding: 120rpx 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.empty-icon {
	font-size: 120rpx;
	margin-bottom: 32rpx;
	opacity: 0.5;
}

.empty-text {
	font-size: 32rpx;
	color: #666666;
	margin-bottom: 16rpx;
	font-weight: 500;
}

.empty-tips {
	font-size: 28rpx;
	color: #999999;
}

/* 加载更多样式优化 */
.load-more {
	padding: 20rpx 0 40rpx;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12rpx;
}

.load-more.loading {
	padding: 32rpx 0;
}

.loading-indicator {
	width: 32rpx;
	height: 32rpx;
	border: 3rpx solid var(--theme-primary);
	border-top-color: transparent;
	border-radius: 50%;
	animation: loading 0.8s linear infinite;
}

@keyframes loading {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.load-more-text {
	font-size: 24rpx;
	color: var(--theme-text-light);
}

.book-list-content {
	padding-bottom: calc(env(safe-area-inset-bottom) + 120rpx);
}

/* 暗黑模式适配 */
.dark-mode .loading-indicator {
	border-color: var(--theme-primary);
	border-top-color: transparent;
}

.dark-mode .load-more-text {
	color: var(--theme-text-light);
}

/* 分享弹框样式 */
.share-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 999;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	animation: v-bind('isClosingShare ? "fadeOut 0.3s ease" : "fadeIn 0.3s ease"');
}

.share-content {
	width: 100%;
	background: var(--theme-card);
	border-radius: 24rpx 24rpx 0 0;
	overflow: hidden;
	padding-bottom: env(safe-area-inset-bottom);
	animation: v-bind('isClosingShare ? "slideDown2 0.3s ease" : "slideUp 0.3s ease"');
}

.share-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.share-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.share-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.share-options {
	padding: 24rpx 32rpx;
}

.share-option {
	display: flex;
	align-items: center;
	gap: 16rpx;
	padding: 24rpx;
	border-radius: 16rpx;
	margin-bottom: 16rpx;
	background: var(--theme-background);
	transition: all 0.3s ease;
	border: 2rpx solid transparent;
}

.share-option.active {
	background: var(--theme-primary-light);
	border-color: var(--theme-primary-border);
}

.share-option:active {
	background: var(--theme-primary-light);
}

/* 暗黑模式适配 */
.dark-mode .share-option {
	background: rgba(255, 255, 255, 0.02);
}

.dark-mode .share-option.active {
	background: var(--theme-primary-light);
	border-color: var(--theme-primary-border);
}

.dark-mode .share-option:active {
	background: var(--theme-primary-light);
}

.share-icon {
	font-size: 40rpx;
	color: var(--theme-primary);
	flex-shrink: 0;
}

.share-option-info {
	flex: 1;
}

.share-option-title {
	font-size: 32rpx;
	font-weight: 500;
	color: var(--theme-text);
	margin-bottom: 4rpx;
}

.share-option-desc {
	font-size: 24rpx;
	color: var(--theme-text-secondary);
}

.share-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.share-btn {
	height: 88rpx;
	background: var(--theme-gradient);
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	transition: all 0.3s ease;
}

.share-btn:active {
	opacity: 0.9;
	transform: scale(0.99);
}

/* 暗黑模式适配 */
.dark-mode .share-radio {
	border-color: var(--theme-text-light);
}

.dark-mode .share-option.active .share-radio {
	border-color: var(--theme-primary);
}

.dark-mode .radio-inner {
	background: var(--theme-primary);
}

/* 弹框基础动画 */
@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes slideUp {
	from {
		transform: translateY(100%);
	}

	to {
		transform: translateY(0);
	}
}

@keyframes slideDown {
	from {
		transform: translateY(0);
		opacity: 1;
	}

	to {
		transform: translateY(-20rpx);
		opacity: 0;
	}
}

@keyframes slideDown2 {
	from {
		transform: translateY(0);
	}

	to {
		transform: translateY(100%);
	}
}

@keyframes fadeOut {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

.share-radio {
	width: 32rpx;
	height: 32rpx;
	border-radius: 50%;
	border: 2rpx solid var(--theme-text-light);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	flex-shrink: 0;
}

.share-option.active .share-radio {
	border-color: var(--theme-primary);
}

.radio-inner {
	width: 16rpx;
	height: 16rpx;
	border-radius: 50%;
	background: var(--theme-primary);
	transition: all 0.3s ease;
}

.share-icon {
	font-size: 40rpx;
	color: var(--theme-primary);
	flex-shrink: 0;
}

.share-option-info {
	flex: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-width: 0;
}

.share-option-main {
	flex: 1;
	min-width: 0;
}

.share-option-title {
	font-size: 32rpx;
	font-weight: 500;
	color: var(--theme-text);
	margin-bottom: 4rpx;
	margin-right: 32rpx;
}

.share-option-desc {
	font-size: 24rpx;
	color: var(--theme-text-secondary);
}

.share-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.share-btn {
	height: 88rpx;
	background: var(--theme-gradient);
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	transition: all 0.3s ease;
}

.share-btn:active {
	opacity: 0.9;
	transform: scale(0.99);
}

/* 暗黑模式适配 */
.dark-mode .share-radio {
	border-color: var(--theme-text-light);
}

.dark-mode .share-option.active .share-radio {
	border-color: var(--theme-primary);
}

.dark-mode .radio-inner {
	background: var(--theme-primary);
}

/* 删除重复的登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
}

.number-btn {
	width: 56rpx;
	height: 56rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	height: 56rpx;
	text-align: center;
	font-size: 24rpx;
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {
	font-size: 28rpx;
	color: var(--theme-text-secondary);
}

.qrcode-footer {
	padding: 24rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.qrcode-btn-group {
	display: flex;
	gap: 20rpx;
}

.qrcode-btn {
	flex: 1;
	height: 88rpx;
	border-radius: 44rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 500;
	gap: 12rpx;
}

.qrcode-btn.save {
	background: var(--theme-background);
	color: var(--theme-text);
	border: 2rpx solid var(--theme-primary-border);
}

.qrcode-btn.share {
	background: var(--theme-gradient);
	color: #FFFFFF;
}

.btn-icon {
	font-size: 36rpx;
}

.qrcode-btn:active {
	opacity: 0.9;
	transform: scale(0.98);
}

/* 暗黑模式适配 */
.dark-mode .qrcode-btn.save {
	background: var(--theme-card);
	border-color: var(--theme-primary-border);
}

.dark-mode .search-icon {
	color: rgba(255, 255, 255, 0.6);
	opacity: 1;
}

.dark-mode .search-bar {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

/* 添加遮罩层样式 */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 98;
	display: none;
}

.dropdown-overlay.visible {
	display: block;
}

/* 调整下拉菜单层级 */
.dropdown-menu {
	z-index: 99;
}

/* 添加登录按钮样式 */
.login-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border-radius: 24rpx;
	padding: 48rpx;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
	width: 600rpx;
	box-sizing: border-box;
}

.login-wrapper::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: -1;
}

.login-btn {
	width: 100%;
	height: 88rpx;
	background: linear-gradient(135deg, #5B9EE7, #4A7FBA);
	border-radius: 44rpx;
	color: #FFFFFF;
	font-size: 32rpx;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	border: none;
	box-shadow: 0 4rpx 12rpx rgba(75, 128, 186, 0.24);
}

.login-btn:active {
	transform: scale(0.96);
	box-shadow: 0 4rpx 8rpx rgba(75, 128, 186, 0.16);
	opacity: 0.9;
}

/* 暗黑模式适配 */
.dark-mode .login-wrapper {
	background: #1A1A1A;
	box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
}

.dark-mode .login-btn {
	background: linear-gradient(135deg, #5B6FFF, #7C47FF);
	box-shadow: 0 4rpx 12rpx rgba(91, 111, 255, 0.24);
}

.dark-mode .login-btn:active {
	box-shadow: 0 4rpx 8rpx rgba(91, 111, 255, 0.16);
}

/* 添加人数输入框样式 */
.share-number-input {
	padding: 16rpx 32rpx;
	border-top: 1rpx solid var(--theme-primary-border);
}

.number-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.number-label {
	font-size: 28rpx;
	color: var(--theme-text);
	flex-shrink: 0;
}

.number-control {
	display: flex;
	align-items: center;
	background: var(--theme-background);
	border-radius: 8rpx;
	border: 2rpx solid var(--theme-primary-border);
	overflow: hidden;
	height: 56rpx;
	/* 减小整体高度 */
}

.number-btn {
	width: 56rpx;
	/* 减小按钮宽度 */
	height: 56rpx;
	/* 减小按钮高度 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	background: var(--theme-background);
	transition: all 0.2s ease;
}

.number-btn:active {
	background: var(--theme-primary-light);
}

.number-input {
	width: 72rpx;
	/* 减小输入框宽度 */
	height: 56rpx;
	/* 减小输入框高度 */
	text-align: center;
	font-size: 24rpx;
	/* 减小字体大小 */
	color: var(--theme-text);
	border-left: 2rpx solid var(--theme-primary-border);
	border-right: 2rpx solid var(--theme-primary-border);
	padding: 0;
	min-height: 0;
	/* 移除最小高度限制 */
}

/* 暗黑模式适配 */
.dark-mode .number-btn {
	color: var(--theme-text);
	background: var(--theme-card);
}

.dark-mode .number-btn:active {
	background: var(--theme-primary-light);
}

.dark-mode .number-input {
	background: var(--theme-card);
	color: var(--theme-text);
}

/* 二维码弹框样式 */
.qrcode-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.qrcode-content {
	width: 600rpx;
	background: var(--theme-card);
	border-radius: 24rpx;
	overflow: hidden;
}

.qrcode-header {
	padding: 32rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid var(--theme-primary-border);
}

.qrcode-title {
	font-size: 32rpx;
	font-weight: 600;
	color: var(--theme-text);
}

.qrcode-close {
	font-size: 48rpx;
	color: var(--theme-text-light);
	padding: 0 20rpx;
}

.qrcode-body {
	padding: 48rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rpx;
}

.qrcode-image {
	width: 400rpx;
	height: 400rpx;
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 40rpx;
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
}

.dark-mode .qrcode-image {
	background: #FFFFFF;
	/* 保持白色背景以确保二维码清晰可见 */
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
}

.qrcode-tips {}
</style>